<include file="public/head" />
</head>
<body>
<div class="am-modal am-modal-alert" tabindex="-1" id="fq_alert">
  <div class="am-modal-dialog">
    <div class="am-modal-hd" id="fq_alert_title"></div>
    <div class="am-modal-bd" id="fq_alert_info">
    </div>
    <div class="am-modal-footer">
      <span class="am-modal-btn">确定</span>
    </div>
  </div>
</div>

<div class="am-modal am-modal-confirm" tabindex="-1" id="fq_confirm">
  <div class="am-modal-dialog">
    <div class="am-modal-hd" id="fq_confirm_title"></div>
    <div class="am-modal-bd" id="fq_confirm_info"></div>
    <div class="am-modal-footer">
      <span class="am-modal-btn" data-am-modal-confirm="">确定</span>
    </div>
  </div>
</div>
<link rel="stylesheet" href="__STATIC__/itaoke/mobile/css/integralmall.css">

<!-- modal start -->
    <div class="am-modal am-modal-confirm" tabindex="-1" id="fq_true_confirm">
      <div class="am-modal-dialog">
        <div class="am-modal-hd" id="fq_true_confirm_title"></div>
        <div class="am-modal-bd" id="fq_true_confirm_info"></div>
        <div class="am-modal-footer">
            <span class="am-modal-btn" data-am-modal-cancel="">取消</span>
            <span class="am-modal-btn" data-am-modal-confirm="">确定</span>      
        </div>
      </div>
    </div>
    <!-- modal end -->
    <div class="am-bd">
        <div data-am-widget="gallery" data-am-gallery="{pureview: 'true'}" class="am-no-layout">
        <img src="{:attach(str_replace('_s.'.array_pop(explode('.', $item['img'])), '_b.'.array_pop(explode('.', $item['img'])), $item['img']), 'score_item')}" alt="" class="detailpic" data-am-pureviewed="1">
        </div>
        <a onclick="window.history.back();" class="am-inline">
            <img src="__STATIC__/itaoke/mobile/images/return.png" class="am-return am-margin-top-sm am-margin-left-sm">
        </a>
        <div class=" am-display am-padding-top-xs am-padding-horizontal-sm am-margin-bottom-xs">
            <span><strong class="line-clamp am-padding-bottom-xs">{$item.title}</strong></span>
            <div class="number am-padding-vertical-xs">
                <span class="credit">积分：<span class="integral-fraction am-credit">{$item.score}</span></span>
                <span class="am-fr price">市场价：¥<span class="am-price">{$item.price}</span></span>
                <br>
                <div class="am-num">
                    <span><span class="am-convert">{$item.buy_num}</span>人兑换</span>
                    <span class="am-fr"><span class="am-stock">{$item.stock}</span>库存</span>
                </div>
                <div class="am-num">
                    活动时间：{$item.start_time|date="Y-m-d",###} - {$item.end_time|date="Y-m-d",###}
                </div>
            </div>
            <div class="am-now am-vertical-align">
                <span class="am-vertical-align-middle">我的积分：</span>
                <span class="integral-fraction am-vertical-align-middle myscore">{$info['score']}</span>
                	<button class="am-btn am-direct am-radius am-padding-horizontal-sm am-padding-vertical-xs am-margin-top-xs am-vertical-align-middle am-fr check_score" data-time="{$times}" data-id="{$item.id}" data-score="{$item.score}" data-inventory="{$item.stock}">立即兑换</button>
            </div>
        </div>
           <div class="am-tabs am-padding-horizontal-sm fq-background-white" data-am-tabs="">
            <ul class="am-tabs-nav am-nav am-nav-tabs">
                <li class="am-detail am-active" style="height:36px"><a href="#tab1">商品详情</a></li>
                <li class="am-recoding" style="height:36px"><a href="#tab2">兑换记录</a></li> 
            </ul>
        <div class="am-tabs-bd" style="touch-action: pan-y; -webkit-user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
        <div class="am-tab-panel am-fade am-active am-in" id="tab1">
            <div class="am-padding-top-sm" style="width:100%;overflow:auto;">
                {$item.info|htmlspecialchars_decode}
            </div>
        </div>
        <div class="am-tab-panel am-fade" id="tab2">
        <notempty name="history" >
        <volist name="history" id="vo">
            <ul class="am-avg-sm-2 am-margin-bottom-sm am-padding-top-sm list_len">
                <li class=" am-vertical-align" style="height:36px">
                   <img class="am-portrait  am-round am-fl" src="{:avatar($vo['uid'], 200)}">
                   <span class="am-vertical-align-middle am-padding-left-sm am-id">{:substr_cut($vo['uname'])}</span>
                </li>
                <li class="am-vertical-align am-text-right" style="height:36px">
                    <span class="am-vertical-align-middle am-center am-time">{$vo.add_time|frienddate}</span>
                </li>
            </ul>
        </volist>
           <else/>
            <div class="am-margin-vertical" style="display:block;width:100%;text-align:center;">该商品暂无兑换记录</div>
        </notempty>
        </div>
    </div>
    </div>

<include file="public/foot" />
</div>
    <style>
        header {
            background: url("assets/i/commodity.jpg") no-repeat;
            min-height: 32rem;
            background-size: cover;
        }
        .am-return {
            width:2.8rem;
            height:2.8rem;
            position: absolute;
            top: 0;
            left: 0;
        }
        .detailpic{
            position: relative;
            width:100%;
        }
        .number {
            border-bottom: .1rem solid #f3e7e3;
        }
        .am-now {
            height: 4rem;
        }
            .am-now a:hover,
            .am-now a:focus {
                color: white;
            }
        strong{
            border-bottom: .1rem solid #f3e7e3;
        }
        .line-clamp {
            -webkit-line-clamp: 2;
            line-height: 1.6rem;
            max-height: 3.5rem;
        }
        li{
            height:3rem;
        }
        #tab1 img{
            max-width: 100%;
        }
</style>
<script>
$(function(){
//处理时间戳
function get_time(time){
    var timeDate = new Date(time*1000);
    var year = timeDate.getFullYear();
    var month = timeDate.getMonth()+1;
    var day = timeDate.getDate();
    var hour = timeDate.getHours();
    var minute = timeDate.getMinutes();
    var second = timeDate.getSeconds();
    if(month<10)
    month = '0'+month;
    if(day<10)
    day = '0'+day;
    if(hour<10)
    hour = '0'+hour;
    if(minute<10)
    minute = '0'+minute;
    if(second<10)
    second = '0'+second;
    var date = year+'-'+month+'-'+day+' '+hour+':'+minute+':'+second;
    return date;
}

$('.am-now').on('click','.check_score',function(){
 		var score='{$item.score}';
 		var myscore=parseInt($('.myscore').text());
 		var inventory=parseInt($(this).attr('data-inventory'));
 		var exchange_time=$(this).attr('data-time');
 		var user_num={$item.user_num};
 		var isvirtual={$isvirtual};
 		if(exchange_time == user_num){
	      $("#fq_alert_info").html("您已兑换过该商品,无法进行兑换！");
	      $('#fq_alert').modal();
	      return false; 
    	}
 		if(inventory>0){
	        if(myscore <score){
	            $("#fq_alert_info").html("亲，兑换该商品您的积分不够哦！");
	            $('#fq_alert').modal();
	            return false;
	        }
    	}else{
	        $("#fq_alert_info").html("抱歉，该商品暂时缺货哦！");
	        $('#fq_alert').modal();
	         return false;
    	}
    	
		$("#fq_true_confirm_info").text('亲，兑换将扣除“'+score+'”积分');
        $('#fq_true_confirm').modal({
            relatedTarget: this,
            closeViaDimmer: false,
            onConfirm: function() {
                $('.virtual_order').html('兑换中 <i class="am-icon-spinner am-icon-spin"></i>');
                var score=$('.am-credit').text();
                var sid='{$item.id}';
                $.ajax({
                    type:'post',
                    url:"{:U('User/addorder')}",
                    data:{"sid":sid,'score':score},
                    dataType:'json',
                    success:function(data){
                   
                        if(data.status==1){
                            $('.virtual_order').html('兑换成功');
                            $("#fq_confirm_info").text(data.data.msg);
            				$('#fq_confirm').modal({
    			                relatedTarget: this,
    				            onConfirm: function() {
    				                window.location.href = data.data.url;
    				            },
			                });
                        }else{
                         	if(data.data.status==undefined ){
                         		$("#fq_alert_info").html("请先登录哦");
                         		$('#fq_alert').modal();
                         		return;
                         	}
                        	if(data.data.status==-1){
                        		$("#fq_alert_info").html(data.data.msg);
                          	  	$('#fq_alert').modal();
                          	//  	window.location.href = data.data.url;
                        	}else{
                        		window.location.href = data.data.url;
                        	}
                       /* 	
                            $("#fq_alert_info").html(data.info);
                            $('#fq_alert').modal();
                            $('.virtual_order').html('立即兑换');
                            $('.virtual_order').prop('disabled',false);
                            $('.virtual_order').removeClass('am-hide');*/
                        }
                    },
                    complete:function(XMLHttpRequest,status){
                        if(XMLHttpRequest.status == 200){
                        }else{
                            $('#fq_alert_info').text('网络连接超时！');
                            $('#fq_alert').modal({});
                            $('.virtual_order').html('立即兑换');
                            // $('.virtual_order').prop('disabled',false);
                             $('.virtual_order').removeClass('am-hide');
                        }
                    }
                });
            },
            onCancel:function(){
                 $('.virtual_order').removeClass('am-hide');
            }
        });
});
});
</script>
</body>
</html>